<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>早养车</title>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <script type="text/javascript" charset="utf-8">
      	mui.init();
    </script>
    <link rel="stylesheet" type="text/css" href="css/header.css"/>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
</head>
<body>
	<!--下面这里是头部-->
	<header class="header">
		<img src="images/index1.png" class="header-logo"/>
		<img src="images/index2.png" class="header-text"/>
	</header>
	<!--上面这里是头部-->
	<!--下面这里是底部导航-->
	<nav class="bottomNav mui-bar mui-bar-tab">
		<a href="#" class="mui-tab-item">
			<img src="images/icon11.png"/>
			<span>首页</span>
		</a>
		<a href="./list.html" class="mui-tab-item">
			<img src="images/icon2.png"/>
			<span>分类</span>
		</a>
		<a href="#" class="mui-tab-item">
			<img src="images/icon3.png"/>
			<span>购物车</span>
		</a>
		<a href="#" class="mui-tab-item customBtn">
			<img src="images/icon4.png"/>
			<span>客服</span>
		</a>
	</nav>
	<!--上面这里是底部导航-->
	
	<!--轮播图-->
	<div id="slider" class="mui-slider" >
		<div class="mui-slider-group mui-slider-loop">
			<div class="mui-slider-item mui-slider-item-duplicate">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
			<div class="mui-slider-item">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
			<div class="mui-slider-item">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
			<div class="mui-slider-item">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
			<div class="mui-slider-item">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
			<div class="mui-slider-item mui-slider-item-duplicate">
				<a href="#">
					<img src="./images/index10.png">
				</a>
			</div>
		</div>
		<div class="mui-slider-indicator">
			<div class="mui-indicator mui-active"></div>
			<div class="mui-indicator"></div>
			<div class="mui-indicator"></div>
			<div class="mui-indicator"></div>
		</div>
	</div>
		
	<!--图标链接-->
	<ul class="iconNav">
		<a href="#"><li class="mui-col-sm-3 mui-col-xs-3 mui-pull-left">
			<img src="images/index3.png"/>
			<h4>热门促销</h4>
		</li></a>
		<a href="#"><li class="mui-col-sm-3 mui-col-xs-3 mui-pull-left">
			<img src="images/index4.png"/>
			<h4>产品分类</h4>
		</li></a>
		<a href="#"><li class="showBuyInfo mui-col-sm-3 mui-col-xs-3 mui-pull-left">
			<img src="images/index5.png"/>
			<h4>购买须知</h4>
		</li></a>
		<a href="#"><li class="mui-col-sm-3 mui-col-xs-3 mui-pull-left customBtn">
			<img src="images/index6.png"/>
			<h4>联系客服</h4>
		</li></a>
	</ul>
	
	<!--中间搜索框-->
	<form class="mui-input-group mui-card">
	    <div class="mui-input-row mui-search">
	    	<input type="search" class="mui-input-clear" placeholder="搜索您想要的商品">
	    </div>
	</form>
	
	<!--中间图片广告-->
	<a href="#" class="ad-img">
		<img src="images/index8.png"/>
	</a>
	
	<!--商品陈列展示-->
	<ul class="goods-list">
		<h4 class="goods-list-head">机油<a href="./list.html">更多</a></h4>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
	</ul>
	
	<!--中间图片广告-->
	<a href="#" class="ad-img">
		<img src="images/index8.png"/>
	</a>
	
	<ul class="goods-list">
		<h4 class="goods-list-head">养车搭档<a href="./list.html">更多</a></h4>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
		<a href="./goods.html"><li class="">
			<div class="goods-list-img">
				<img src="images/index9.png"/>
			</div>
			<div class="goods-list-price">
				￥456.0<span>（媒体专供）</span>
			</div>
			<div class="goods-list-market">
				市场价格：<span>￥688.00</span>
			</div>
			<div class="goods-list-txt">
				嘉实多（Castrol）极护合成机油0W-40 4L装
			</div>
		</li></a>
	</ul>
	<!--购买须知-->
	<div class="buyInfo">
		<div class='mui-content buyInfo-wrap'>
			<div class="mui-icon mui-icon-close closepay"></div>
			<div class='goods-list-head buyInfo-head'>
				购买须知
			</div>
			<p class="buyInfo-content">
				关于本店：
				本店是专柜直营的专业网店，本店所售商品均为品牌正品，支持专柜验货，并郑重承诺“消保签约商家”、“品牌正品”、“假一赔三”、非订货品“24小时贴心换货服务”。 
				
				关于交易：
				本店所售商品均为本店专柜正品，由于专柜走货较快，库存在时刻更新，因此，顾客在拍下商品前请先和我店客服人员联系，确认货品是否有现货，并在拍下后及时付款，拍下后24小时内未付款订单，掌柜将给予关闭交易。
				
				关于订货：
				在无现货时，本店可提供订货服务，由于订货是向
				关于本店：
				本店是专柜直营的专业网店，本店所售商品均为品牌正品，支持专柜验货，并郑重承诺“消保签约商家”、“品牌正品”、“假一赔三”、非订货品“24小时贴心换货服务”。 
				
				关于交易：
				本店所售商品均为本店专柜正品，由于专柜走货较快，库存在时刻更新，因此，顾客在拍下商品前请先和我店客服人员联系，确认货品是否有现货，并在拍下后及时付款，拍下后24小时内未付款订单，掌柜将给予关闭交易。
				
				关于订货：
				在无现货时，本店可提供订货服务，由于订货是向
			</p>
		</div>
	</div>
	
	<!--客服咨询-->
	<div class="custom mui-fullscreen">
		<div class="custom-wrap">
			<div class="mui-icon mui-icon-close closepay" id="closeCustom"></div>
			<p class="mui-text-center mui-h4" >0771-5690224</p>
			<a class="custom-btn mui-icon mui-icon-phone-filled mui-text-center" href="tel:0771-5690224">  电话咨询</a>
			<div class="custom-line"></div>
			<img class="custom-2dcode" src="images/2dcode.png"/>
			<a class="custom-btn mui-icon mui-icon-weixin mui-text-center">  微信咨询</a>
		</div>
	</div>
	
	
	<!--底部页脚-->
	<footer class="footer">
		早养车超值平台·南国早报独立开发运营·合作请拨热线
	</footer>
	<script type="text/javascript" src="js/index.js"></script>
	<script type="text/javascript">
		;(function(){
			var buyInfo = document.querySelector('.buyInfo');
			document.querySelector('.showBuyInfo').addEventListener('tap',function(){
				buyInfo.style.display = "block";
			});
			document.querySelector('.closepay').onclick = function(){
				buyInfo.style.display = "none";
			};
		})();
	</script>
</body>
</html>